Нетология – мои впечатления от обучения, новые инструменты

Как-то я уже говорил, что собираюсь изучать HTML-верстку на курсах Нетологии. С тех пор прошло несколько недель, и теперь могу поделиться первыми впечатлениями от процесса. По плану осталось изучить только уроки по JavaScript и выполнить текущие домашние задания. Статья будет небольшая, в виде тезисов.

Итак, сначала хочется отметить, что курс «HTML-верстка: с нуля до первого макета», полностью соответствует своему названию. То есть реально все начинается с введения в верстку, рассматриваются базовые теоретические понятия, теги, css, принципы и софт для работы, подключение FTP и т.д. Преподаватели детально останавливаются на базовых элементах HTML — ссылках, изображениях, блоках. Если вы вообще ничего не понимаете в верстке, то можете быть уверенным, что здесь обучение начинается с азов. Мне, как уже более опытному пользователю, уроки из цикла «Введение» не открыли практически ничего нового.

Интересно было посмотреть какими программами пользуются преподаватели. Открыл для себя парочку новых инструментов:

• Sublime Text 2 — редактор для верстки. В принципе, можно было обойтись и привычным мне Notepadd++, но этот продукт, вроде как, больше подходит для кодинга и работы с HTML, CSS, JS. Тут есть подсказки при вводе тегов, массовое редактирование кода и другие интересные функции, доступные через горячие клавиши. Многое, конечно, зависит от настроек, и Notepadd++ можно привести к нужному виду, однако я решил установить Sublime Text 2 и постепенно перейти на него.

• Emmet — дополнение для Sublime Text 2, Notepadd ++ и других редакторов, позволяющее добавлять быстрый ввод нужного кода через автозамену специальных конструкций. Например, пишите «.myclass», жмете Tab и получаете код «<div class=»myclass»></div>». Есть куда более сложные конструкции, списки, например, можно быстро создавать.
• Jsfiddle — на странице вводите HTML, CSS и JS код в отдельных окнах, и в реальном времени можете наблюдать результат. Удобно для тестирования.
• Инспектор — встроенный инструмент в Firefox и Chrome, который вызывается сочетанием клавиш Ctrl+Shift+I. Позволяет просматривать код сайта, редактировать его и видеть в реальном времени изменения на сайте (без сохранения на сервере).
• Просмотр сайта в разных разрешениях (для смартфонов и планшетов) доступен при нажатии в Firefox Ctrl+Shift+M — тоже весьма полезная штука.

Преподаватели Нетологии не только рассказывают обо всех подобных сервисах и программах, но и на практике демонстрируют как это все функционирует. Полезно посмотреть за действиями профи дабы самому потом использовать те же инструменты.

Начиная со второго и третьего блока курса «HTML-верстка: с нуля до первого макета» пошли уже более интересные мне материалы — выбор сетки сайта, позиционирование блоков. Тут я впервые детально познакомился с фреймворками для верстки, в частности Bootstrap.

Если вкратце, то это готовая сетка сайта со стилями и типовыми решениями для элементов веб-страницы, которые вы можете легко использовать для своего проекта. Заменой в HTML коде нескольких стилей вы сможете добавить сайту адаптивность на мобильных устройствах. Очень интересная и мощная штука! Полезный получился урок по данном фреймворку, изучать самостоятельно было бы не так просто и не так наглядно (особенно начинающим).

Также открыл для себя несколько новых приемов по работе с фотошопом. Кое-что, конечно, знал, но, например, никогда не работал с инструментом нарезки — удобная вещь. Много времени было уделено шрифтам — начертанию, единицам измерения, тегам для работы с ним. Я не до конца просмотрел данный урок, поэтому еще не полностью вник в работу с ними.

Хорошо, что уроки можно просматривать после их завершения. Если честно, время проведения занятий выбрано было немного странно. Все они начинаются в 5 часов, что для обычного офлайнового рабочего графика неудобно. Мне как «онлайновому деятелю» это не доставило особой сложности, но для работающих людей попасть на занятие, наверное, непросто. Однако, как я уже сказал, вы можете в любой момент просмотреть тот или иной урок в удобное для вас время. Некоторые видео повторно просматривал дабы прояснить для себя непонятные детали.

Единственный плюс реального онлайнового обучения — возможность задавать вопросы. С этим, кстати, немного двоякая ситуация. Иногда задаваемые вопросы немного дезориентируют докладчика: с одной стороны важно разобрать какие-то моменты прямо походу темы, с другой — приходиться перепрыгивать от одного вопроса на другой. Некоторые преподаватели заканчивают начатую тему, а потом отвечают на вопросы — наиболее хороший подход. Правда, если подумать, все это не особо критично — ведь всегда есть видеозапись, которую можно позже пересмотреть, если запутались в каком-то вопросе.

Что дальше? Сейчас выполняю задание по создании сетки сайта и позиционированию блоков. Попался слегка нетипичный макет.

Выручает связь с наставником по обучению — можно решить интересующие вас вопросы. Вот жду от него совета по некоторым деталям и буду верстать дальше. Также остались уроки по JavaScript, хотя, если честно, я еще не просмотрел два предыдущих — не всегда удается попасть на занятия во время их проведения, чаще смотрю в записи.

Кстати, если вы желаете записаться на следующий набор по курсу «HTML-верстка: с нуля до первого макета» то можете использовать бонусный код tod на скидку 2000 рублей для обучения. Промокод работает до конца мая 2015 и действует на все программы Нетологии.